<template>
	<div class="login-box clearfix">
		<QRCode/>
		<div class="line"></div>
		<div class="right">
			<LoginForm ref="form"/>
			<Remember @change="change"/>
			<LoginBtn @login="login"/>
			<LoginMore/>
		</div>
	</div>
</template>

<script>
import QRCode from './QRCode'
import LoginForm from './LoginForm'
import Remember from './Remember'
import LoginBtn from './LoginBtn'
import LoginMore from './LoginMore'

export default{
	data(){
		return{
			username: '',
			password: '',
			phone: '',
			node: '',
			remember: '',
			select: ''
		}
	},
	components:{
		QRCode,
		LoginForm,
		Remember,
		LoginBtn,
		LoginMore
	},
	methods:{
		login(){
			let result = this.$refs.form.submit();
		},
		change(name, val){
			this[name] = val
		}
	}
}
</script>

<style scoped lang="less">
.login-box{
	width: 980px;
	margin: 0 auto;
	.line{
		float: left;
		border-right: 1px solid #ddd;
		height: 300px;
		margin-top: 28px;
	}
	.right{
		float: left;
		width: 489.5px;
		padding-left: 44.5px;
		padding-top: 50px;
		padding-right: 31px;
		box-sizing: border-box;
		.remember-box{
			// margin: 3.5px 0 10px 0;
		}
	}
}
</style>
